<template>
  <basic-dialog
    :title="dialogTitle"
    :visible="dialogVisible"
    :handleClose="handleCancel"
    :showFooter="false"
  >
    <SkusTable
      :tableHeight="440"
      :showSelectCol="false"
      :showPagination="showPagination"
      :loading="TableInfo.loading"
      :columns="TableInfo.columns"
      :dataSource="TableInfo.list"
      :pagination="pagination"
      :pageSizes="pageSizes"
      :total="pagination.total"
      @pageChange="handlePageChange"
      @pageSizeSelect="handlePageSizeChange"
    />
  </basic-dialog>
</template>
<script>
import BasicDialog from '@/components/BasicDialog';
import SkusTable from '@/components/skusTable';
import skusPage from '@/mixins/commodity/skusPage';
import { TableInfo } from '@/utils/getUtils';
export default {
  mixins: [skusPage],
  components: {
    BasicDialog,
    SkusTable
  },
  props: {
    visible: {
      type: Boolean,
      required: true
    },
    dialogTitle: {
      type: String,
      default: '查看列表'
    },
    tableLoading: {
      type: Boolean,
      default: false
    },
    tableColumns: {
      type: Array,
      default () {
        return [];
      }
    },
    tableData: {
      type: Array,
      default () {
        return [];
      }
    },
    showPagination: {
      type: Boolean,
      default: false
    },
    searchList: {
      type: Function
    },
  },
  data () {
    return {
      dialogVisible: false,
      TableInfo: new TableInfo({ list: this.tableData, columns: this.tableColumns, loading: this.tableLoading }),
      pageSizes: [10, 100, 1000]
    }
  },
  watch: {
    visible (val) {
      this.dialogVisible = val
      if (this.searchList && val) this.getTableData()
    },
    tableData (list) {
      this.TableInfo.setList(list)
    }
  },
  methods: {
    // 设置表格列表集合
    async getTableData () {
      const res = await this.searchList(this.paginationParams, this.TableInfo.setLoading)
      if (res?.retData?.results) { // 含分页
        this.TableInfo.setList(res.retData.results)
        this.setTotalNum(res.retData.totalNum)
        return false
      }
      if (res?.retData) { // 不含分页
        this.TableInfo.setList(res.retData)
      }
    },
    handleCancel () {
      this.$emit('update:visible', false);
    }
  }
}
</script>
